<template>
  <div class="recruit">
    <el-tabs v-model="activeName">
      <el-tab-pane label="线上授课" name="1">
        <online />
      </el-tab-pane>
      <el-tab-pane label="报名续费" name="2">
        <apply />
      </el-tab-pane>
      <el-tab-pane label="招生表单" name="3">
        <recruitform />
      </el-tab-pane>
      <el-tab-pane label="CRM" name="4">
        <client @studentApply="studentApply" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import online from './components/recruit/online'
import apply from './components/recruit/apply'
import recruitform from './components/recruit/recruitform'
import client from './components/recruit/client'

export default {
  components: {
    online,
    apply,
    recruitform,
    client
  },
  data() {
    return {
      activeName: '1',
      studentId: ''
    }
  },
  methods: {
    studentApply(data) {
      this.activeName = '2'
      this.studentId = data
    }
  }
}
</script>

<style lang="scss" scoped>
.recruit {
  padding: 0 20px;
}
</style>
